@import "./variables.scss";

// el-input样式
::v-deep .el-input__inner,
::v-deep .el-textarea__inner,
::v-deep .el-tree,
::v-deep .is-disabled .el-input__inner,
::v-deep .el-date-editor .el-range-input,
::v-deep .el-tree .el-checkbox__input .el-checkbox__inner,
::v-deep .el-textarea .el-textarea__inner {
  background-color: transparent;
  // color: #fff;
  border-radius: 0;
  border-color: $inputBorderColor;
  // color: #fffff0;
  color: $activeCompanyMenuText;

}

// el-tree样式 by author zh
::v-deep .el-tree {
  // background-color: #023D50 !important;
  color: #f0f4f9;
  font-weight: 500;
  height: 100%;
  overflow-y: auto;
  width: 100%;
  // scrollbar-width: none;
}

/* 树状背景色 */
::v-deep .el-tree-node__content:hover {
  background-color: $TreeViewBgColor !important;
}

::v-deep .el-tree-node .el-tree-node__content {
  background-color: $TreeViewBgColor ;
  // margin-top: .625rem;
  line-height: 1.625rem;
  height: 1.625rem;
  padding: 1rem 0rem;
}

::v-deep .el-tree-node__children .el-tree-node__content {
  margin-left: 0% !important;
  width: 90%;
  background-color: $TreeViewBgColor !important;
  // margin-top: .625rem;
}

::v-deep .el-tree-node__label {
  background-color: $TreeViewBgColor;
  width: 100%;
  color: $TreeViewTextColor !important;
  text-align: start;
}

::v-deep .is-hidden {
  display: table-cell;
  box-sizing: border-box;
}

// 取消旋转
::v-deep .el-tree .el-tree-node__expand-icon.expanded {
  -webkit-transform: rotate(0deg) !important;
  transform: rotate(0deg) !important;
}




::v-deep .el-tree-node:focus .el-tree-node__content,
::v-deep .el-tree-node.is-expanded .el-tree-node__content,
::v-deep .el-tree-node.is-expanded .el-tree-node__children,
::v-deep .el-tree-node.is-expanded.is-current .el-tree-node__children {

  background-color: transparent !important;

  // .el-tree-node__label {
  //   // color: #2A94FC !important;
  //   background-color: transparent !important;
  // }

  // .custom-tree-node.all>div {
  //   // color: #2A94FC !important;
  //   background-color: transparent !important;
  // }
}

::v-deep .el-tree-node.is-current,
::v-deep .el-tree-node.is-current>.el-tree-node__content,
::v-deep .el-tree-node.is-current>.el-tree-node__children,
::v-deep .el-tree-node.is-current>.el-tree-node__children>.el-tree-node__label,
::v-deep .el-tree-node.is-current>.el-tree-node__content>.el-tree-node__label {
  background-color: #2A94FC !important;
  transition: 20ms;
  // color: #fff !important;

  // .el-tree-node__label {
  //   color: #fff !important;
  //   background-color: transparent !important;
  // }

  // .custom-tree-node.all>div {
  //   color: #fff !important;
  //   background-color: transparent !important;
  // }



}

::v-deep .el-tree-node:hover,
::v-deep .el-tree-node:hover>.el-tree-node__content,
::v-deep .el-tree-node:hover>.el-tree-node__content>.el-tree-node__label {
  background-color: #2A94FC !important;
  transition: 20ms;
  // color: #fff !important;

  // >.el-tree-node__label {
  //   color: #fff !important;
  //   background-color: transparent !important;
  // }

  // .custom-tree-node.all>div {
  //   color: #fff !important;
  //   background-color: transparent !important;
  // }


}

::v-deep .el-tree-node .el-tree-node__children,
::v-deep .el-tree-node.is-current .el-tree-node__children {
  .el-tree-node .el-tree-node__expand-icon.is-leaf:before {
    filter: drop-shadow(6.25rem 0 0 $TreeViewTextColor);
    transform: translateX(-6.25rem)
  }

  .el-tree-node.is-current .el-tree-node__expand-icon.is-leaf:before {
    filter: grayscale(100%) brightness(200%);
    transform: translateX(0rem)
  }

  .el-tree-node .el-icon-caret-right:before {
    filter: drop-shadow(6.25rem 0 0 $TreeViewTextColor);
    transform: translateX(-6.25rem)
  }

  .el-tree-node .expanded.el-tree-node__expand-icon.el-icon-caret-right:before {
    filter: drop-shadow(6.25rem 0 0 $TreeViewTextColor);
    transform: translateX(-6.25rem)
  }
}

::v-deep {
  .el-tree-node {
    .el-tree-node__children {

      .el-tree-node {
        // >.el-tree-node__label {
        //   // color: #2A94FC !important;
        // }

        // >.custom-tree-node.all>div {
        //   // color: #2A94FC !important;
        // }

        &:hover {

          // >.el-tree-node__label {
          //   color: #fff !important;
          // }

          // >.custom-tree-node.all>div {
          //   color: #fff !important;
          // }

          .el-tree-node__expand-icon.is-leaf:before {
            filter: grayscale(100%) brightness(200%);
            transform: translateX(0rem)
          }

          .el-icon-caret-right:before {
            filter: grayscale(100%) brightness(200%);
            transform: translateX(0rem)
          }

          .expanded.el-tree-node__expand-icon.el-icon-caret-right:before {
            filter: grayscale(100%) brightness(200%);
            transform: translateX(0rem)
          }
        }
      }
    }
  }
}

// ::v-deep .el-tree-node:focus {
// background-color: #2A94FC !important;
// }

::v-deep .el-tree-node__children .el-tree-node__content {
  margin-left: 10%;
  width: 89%;
}

::v-deep .el-tree-node.is-expanded>.el-tree-node__children {
  display: block;
  margin-top: 0rem;
}

::v-deep .el-tree-node {
  white-space: nowrap;
  outline: 0;
  background-color: $TreeViewBgColor;
  border: $TreeViewBorderColor .0625rem solid;
  margin-top: 0rem;
}

::v-deep .el-tree-node__children .el-tree-node {
  margin-top: 0rem !important;
}

// 隐藏滚动条
::v-deep .el-tree::-webkit-scrollbar {
  width: 0 !important
}

// ::v-deep .el-tree-node .el-tree-node__content {
//   background-color: #024E66;
// }
// #024E66
// -----------------
// el-table样式
::v-deep .el-table {
  background-color: transparent;
  color: $contentColor;
  display: flex;
  flex-direction: column; //垂直排
  max-height: 90%;
  height: 92%;
  border: .0625rem solid #00000000 !important;

  .el-table__header-wrapper {
    min-height: 1.875rem;

    border-top-left-radius: 8px;
    border-top-right-radius: 8px;

    .el-table__header {
      min-width: 100%;
      // width: max-content !important;
    }

  }

  // .el-table__body-wrapper.is-scrolling-left {
  //   .el-table__empty-block {
  //     // width: 100% !important;
  //   }
  // }

  // height: 90% !important;
  &::after {
    display: none;
  }

  .el-table__body-wrapper {
    flex: 1; //表格高度自适应，因为flex布局的原因，会自动撑满
  }

  &::before {
    background-color: transparent;
  }

  &::after {
    width: .625rem;
    background-color: transparent;
  }
}

::v-deep .el-table__empty-text {
  color: $activeCompanyMenuText;
  font-size: 1.125rem;
}

::v-deep .el-table .el-table-column--selection>.cell {
  padding-right: .625rem;
}

::v-deep .el-table th {
  background-color: $tableHeaderColor;
}

::v-deep .el-table thead.is-group th {
  background-color: $tableHeaderColor;

}

::v-deep .el-table--medium td {
  padding: .125rem 0;

  .cell {
    min-height: 2.1875rem;
    display: flex;
    align-items: center;
    justify-content: center;

  }
}

::v-deep .el-table__fixed-right {
  box-shadow: -0.25rem -0.4375rem .5625rem .0625rem #00000042;
  // display: flex;

  &::before,
  &::before {
    content: '';
    height: .875rem;
    background-color: initial;
    z-index: 3;
  }

  .el-table__fixed-right-patch {
    background-color: $tableHeaderColor;
  }

  .el-table__body {
    height: 100%;

  }
}

@mixin rightFixedStyle($bottom) {
  height: auto !important;
  bottom: $bottom !important;
  left: auto;
  right: 0;
}

//表格有滚动条情况下固定列的样式
::v-deep .el-table .el-table__fixed-right {
  @include rightFixedStyle(.75rem)
}

//与上面的样式相对应，在没有滚动条的情况下回复原状
::v-deep .el-table__body-wrapper.is-scrolling-none~.el-table__fixed,
::v-deep .el-table__body-wrapper.is-scrolling-none~.el-table__fixed-right {
  .el-table__body {
    height: 100%;
  }

  @include rightFixedStyle(0rem)
}


::v-deep .el-table--medium th {
  padding: .3125rem 0;
}

::v-deep .el-table tr,
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td {
  background-color: #EDEDED;
}

// 解决行无法铺满整个表格
::v-deep .el-table__body-wrapper .el-table__body {
  // height: 100% !important;
  // width: auto !important;
  // width: 100%;
  min-height: 100%;
}

::v-deep .el-table th.gutter,
colgroup.gutter {
  width: .875rem !important; //此处的宽度值，对应你自定义滚动条的宽度即可
  height: .875rem !important;
}

// 解决竖线对不齐
// ::v-deep .el-table th.gutter {
// display: table-cell !important;
// width: 3.75rem !important;
// }

::v-deep .el-table .el-table__header colgroup col[name="gutter"] {
  display: table-cell !important;
}

::v-deep .el-table td,
::v-deep .el-table--border,
::v-deep .el-table--group {
  border: .0625rem solid $tableBorderColor !important;

  & {
    border-top-width: 0 !important;
    border-right-width: 0 !important;
  }
}

::v-deep .el-table.el-table--border {
  border: .0125rem solid transparent !important;


  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

::v-deep .el-table--border th {
  border: .0625rem solid $tableBorderColor;

  & {
    border-top-width: 0 !important;
    border-right-width: 0 !important;
  }
}

::v-deep .el-table th.is-leaf {
  margin-top: -0.0313rem;

  &:nth-last-child(2) {
    border-right: 0;
  }

  border: .0625rem solid $tableBorderColor
}

::v-deep .el-table-column--selection {
  width: auto !important;
  border-left: 0rem solid #0091b7 !important;
}

::v-deep .el-table .el-table__row {
  background-color: #FFFFFF;
}

// table线条纹
// ::v-deep .el-table .el-table__row--striped {
//   background-color: $tableStripeColor;
// }

::v-deep .el-table thead {
  color: #fff;
  font-weight: bold;
}

::v-deep .el-table td,
::v-deep .el-table th {
  text-align: center;
}

::v-deep .el-table__body-wrapper {
  height: 100%;
  width: 100% !important;


}

::v-deep .el-table__fixed-right-patch {
  background-color: $tableHeaderColor;
  // margin-top: -0.0313rem;
  border: .0625rem solid #D6D6D6;
  top: 0rem;
}

::v-deep .el-upload-list.el-upload--picture-card {
  width: 2.5rem;
  height: 2.5rem;
  background-color: rgba(255, 255, 255, 0.1);
  border: .0625rem solid #6ecae3;
  position: relative;
}

::v-deep .el-upload-list.el-upload--picture-card .el-icon-plus {
  font-size: 2.125rem;
  color: #6ecae3;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

::v-deep .el-dialog__body {
  height: 90%;
  text-align: center;

  img {
    width: 100%;
  }
}

// ::v-deep .el-upload__tip {
//   display: none;
// }
::v-deep {
  .image-slot {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;

    i {
      font-size: 40px;
    }
  }
}

// 表格hover及选中样式
::v-deep .el-table tr:hover,
::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td,
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped.current-row td,
::v-deep .el-table__body tr.current-row>td {
  background-color: $tableHoverColor;

  .cell {
    color: #fff;
  }
}

::v-deep .el-table__body tr.hover-row.current-row>td,
::v-deep .el-table__body tr.hover-row.el-table__row--striped.current-row>td,
::v-deep .el-table__body tr.hover-row.el-table__row--striped>td,
::v-deep .el-table__body tr.hover-row>td {
  background-color: $tableHoverColor;
}

// el-checkbox
::v-deep .el-checkbox .is-checked .el-checkbox__inner,
::v-deep .el-checkbox .is-indeterminate .el-checkbox__inner {
  background-color: #61aa47;
  border-color: #61aa47;
}

// el-form
::v-deep .el-form {
  .el-form-item__label {
    // color: #fff;
    color: $activeCompanyMenuText;

    white-space: nowrap;
    min-width: 7.5rem;
    text-align: right;
  }
}

// el-loading-mask
::v-deep .el-loading-mask {
  background-color: transparent;
}

// el-date-editor
::v-deep .el-range-separator {
  // color: #fff;
  color: $activeCompanyMenuText;
}

//进度条文字颜色
::v-deep .el-progress__text {
  // color: #fff;
  color: $activeCompanyMenuText;
}

// 对话框样式
::v-deep .el-dialog {
  background-color: #f0f3f7;
  color: #333333;
  border-radius: .625rem;

  .el-dialog__header {
    border-top-left-radius: .625rem;
    border-top-right-radius: .625rem;
    background-color: #006e91;

    >span {
      display: inline-block;
      min-height: 1.625rem;
    }

    .el-dialog__title {
      color: #fff;
    }

    .el-dialog__headerbtn .el-dialog__close {
      color: #fff;
    }
  }

  .el-dialog__body {
    color: #333333;

    .input-line {
      margin-left: 2.5%;
      width: 95%;
      height: 2.25rem;
      line-height: 2.25rem;
      display: flex;
      margin-bottom: .3125rem;

      .input-line-lab {
        width: 5.625rem;
        white-space: nowrap;
      }

      .input-two-line {
        width: 50%;
        display: flex;
      }
    }

    .dialog-footer {
      width: 100%;
      display: flex;
      flex-direction: row-reverse;
      -ms-flex-direction: row-reverse;
      // border-top: .625rem solid #bfbfbf;
      background-color: #f2f2f2;

      .el-button {
        margin-left: .625rem;
      }

      .zh-button-one {
        background-color: #fff;
        border-color: #1F74C7;
        color: #1F74C7;

      }

      .zh-button-one:hover {
        background-color: #006f9128;
        border-color: #1F74C7;
        color: #1F74C7;

      }
    }

    ::v-deep .el-input--medium .el-input__inner {
      color: aqua !important;
    }
  }
}

::v-deep .input-line-input {
  width: calc(100% - 7.5rem);
}

.zh-button-one {
  background-color: #fff;
  border-color: #1F74C7;
  color: #1F74C7;

}

::v-deep .input-line-input .el-input__inner {
  width: 100%;
  color: rgb(81, 92, 92) !important;
}

// ::v-deep .dialog-footer .zh-button-one {
//   border-color: #1F74C7;
//   background-color: #fff;
//   color: #1F74C7;
// }

::v-deep .dialog-footer .zh-button-one:hover {
  background-color: #006f9128;
  border-color: #1F74C7;
  color: #1F74C7;
}

::v-deep .dialog-footer .zh-button-two {

  background-color: #1F74C7;
  color: #fff;
}

::v-deep .dialog-footer .zh-button-two:hover {
  background-color: #006f9128;
  border-color: #1F74C7;
  color: #06d4f8;
}

::v-deep .dialog-footer .zh-button-two.is-disabled,
::v-deep .dialog-footer .zh-button-two.is-disabled:hover {
  background: #f0f0f0;
  color: #939393;
  border-color: #939393;
}


::v-deep .el-dialog__wrapper.sheepSelectDialog {

  .el-dialog {
    margin-top: 1vh !important;
  }
}

::v-deep .el-dialog__wrapper {
  // background-color: rgba(124, 143, 143, 0.6);
  // .el-dialog__wrapper{
  // position: absolute !important;
  margin-left: 210px;
  width: calc(100% - 210px);
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  // }
  .el-dialog {
    margin-top: unset !important;
    // background-color: rgba(240, 243, 247, 1);
    // width: 100%;
    min-width: 74%;
    max-height: 80%;
    border: #000 .0625rem solid;
    border-radius: .5625rem;
    overflow: hidden;
    color: #000;

    .el-dialog__header {
      width: 100%;
      background-color: rgba(0, 110, 145, 1);
      padding: .9375rem;

      .el-dialog__title {
        font-weight: 700;
      }

      .el-dialog__close {
        font-size: 1.375rem;
        color: #fff;
        font-weight: 700;
      }
    }

    .el-dialog__body {
      //overflow: hidden;
      max-height: calc(80vh - 25vh);
      overflow-y: auto;

      .el-input__inner {
        color: #000;
        border-color: rgba(217, 217, 217, 1);
        background-color: rgba(255, 255, 255, 1);
      }

      .el-textarea__inner {
        color: #000;
        border-color: rgba(217, 217, 217, 1);
        background-color: rgba(255, 255, 255, 1);
      }

      .el-table {
        max-height: 12.5rem;
        overflow-y: auto;
        background-color: rgba(255, 255, 255, 1);

        .cell {
          color: #000;
        }

        th {
          background-color: rgba(230, 230, 230, 1);
        }

        th.is-leaf {
          border-color: rgba(77, 77, 77, 1);
        }

        td {
          border-color: rgba(77, 77, 77, 1);
        }

        tr:hover {
          background-color: rgba(77, 77, 77, 1);
        }

        .el-table__empty-text {
          color: #000;
        }

        .current-row {
          // background-color: rgb(177, 177, 177);
          background-color: #dbdbdb !important;
        }

        .el-table__row--striped {
          background-color: rgba(255, 255, 255, 1);
        }

        // color: #000;
      }

      .el-table--border {
        border-color: rgba(77, 77, 77, 1);
        border-top-left-radius: .5rem;
        border-top-right-radius: .5rem;
      }

      .el-table--enable-row-hover .el-table__body tr:hover>td {
        background-color: rgb(177, 177, 177);
      }

      .el-table__body tr.current-row>td {
        background-color: #dbdbdb !important;
      }

      .el-form {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;

        .total-price {
          color: #000;
        }

        .el-row {
          width: 100%;
          margin-bottom: .625rem;


          // .el-button {
          //   width: 100%;
          // }
          .el-form {

            // width: 100%;
            // margin: ;
            .el-form-item {
              margin-bottom: 0 !important;
            }

            .el-form-item__content {
              display: flex;
              width: 100%;
              height: 100%;

              .el-select {
                min-width: 15%;
              }

              .el-input {
                min-width: 10%;
              }

              .el-input__inner {
                border-right: none;
              }

              .el-button {
                min-width: 5%;
                margin-left: .625rem;
              }
            }
          }
        }

        .el-form-item {
          display: flex;
          align-items: flex-start;

          .el-form-item__label {
            line-height: 2.25rem;
            min-width: 7.5rem;
            text-align: end;
          }

          .el-form-item__content {
            line-height: 2.25rem;
            width: 100%;
            height: 100%;
            display: flex;
            // flex-direction: row;
            flex-wrap: wrap;
            align-items: center;
            position: relative;
          }
        }
      }
    }

    .el-dialog__footer {
      width: 100%;
      border-top: .0625rem solid rgba(191, 191, 191, 1);
      position: inherit;
      text-align: right;
      padding: .9375rem;
    }

    .el-form-item__label {
      color: #000;
      font-weight: 400;
      font-size: 1rem;
    }
  }
}

.v-modal {
  position: absolute !important;
}


::v-deep .is-disabled.text-btn-cursor.cursor-delete {
  color: #C0C4CC;
}

::v-deep .el-divider__text {
  background-color: transparent;
  font-size: 1rem;
}
